<template>
    <div class="banner">
        <img class="banner_bg" src="" alt />
        <div class="customer_banner_wrap">
            <MaskContent title="我们的客户" content="翔盛悦为商业银行、消费金融公司、信托公司、银行理财子公司、小贷公司、金融科技公司等金融行业客户群体提供各类业务系统开发需求的开发建设、各类细分领域金融需求的供需匹配、各类互联网平台营销工具及配套风控模块的成熟产品，包括审批决策云服务、贷后催收云服务、消费金融业务系统、供应链金融业务系统、房抵贷业务系统等多种产品及服务。"/>
        </div>

    </div>
</template>

<script>
    import MaskContent from "./MaskContent";
    export default {
        components:{
            MaskContent,
        }
    };
</script>

<style lang="scss">
    .banner {
        position: relative;

        .banner_bg {
            content: url("../assets/image/home/banner.png");
            width: 100%;
        }

        .customer_banner_wrap {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

    }
    .banner img {
        display: block;
        width: 100%;
    }

    /**
    移动端样式
     */
    @media screen and (max-width: $mobile_width) {
        .banner {

            .banner_bg {
                content: url("../assets/image/home/banner_m.png");
                min-height: 200px;
            }

            .customer_banner_wrap {
                display: flex;
                flex-direction: column;
                justify-content: flex-end;
            }
        }
    }
</style>
